<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
</head>
<style>
    * {
        margin: 0;
        padding: 0;
    }

    .box {
        width: 100vw;
        height: 100vh;

    }

    #one {
        background-color: pink;
        text-align: center;
    }

    #two {
        background-color: rgb(196, 84, 171);
        text-align: center;
    }

    #three {
        background-color: rgb(67, 216, 216);
        text-align: center;
    }

    #four {
        background-color: rgb(105, 199, 136);
        text-align: center;
    }

    #five {
        background-color: rgb(216, 67, 62);
        text-align: center;
    }
    
</style>

<body>

    <div class="box" id="one" >
        <div class="btn">
            <a href="#one">one</a>
            <a href="#two" >two</a>
            <a href="#three">three</a>
            <a href="#four">four</a>
            <a href="#five">five</a>
        </div>

        <div>one</div>
    </div>

    <div class="box" id="two">two</div>
    <div class="box" id="three">three</div>
    <div class="box" id="four">four</div>
    <div class="box" id="five">five</div>
</body>

</html>